<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>50bus-创意发布</title>
    <meta name="keywords" content="50bus" />
    <meta name="copyright" content="50bus.cn" />
    <!-- <meta http-equiv="mobile-agent" content="http://www.50bus.cn/" />
    <link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" /> -->
    <link rel="icon" href="/resources/img/favicon.ico" type="image/x-icon" />
    
    <link rel="stylesheet" type="text/css" href="resources/css/base.css" media="all" />
    <link rel="stylesheet" type="text/css" href="resources/css/globe.css" media="all" />
    <link rel="stylesheet" type="text/css" href="resources/css/module-creative.css" media="all" />
    <link rel="stylesheet" href="resources/kindeditor/themes/default/default.css?v=${js_css_version}" />
    <link rel="stylesheet" type="text/css" href="resources/css/module-creative-dadong.css" />
	<script type="text/javascript" src="/resources/js/jquery-1.9.1.min.js"></script>
	<link rel="stylesheet" type="text/css" href="/resources/css/page.css" media="all" />
	<script type="text/javascript" src="/resources/js/jquery.form.js"></script>
	<script type="text/javascript" src="/resources/js/jquery.validate.js"></script>
	<script type="text/javascript" src="/resources/kindeditor/kindeditor.js"></script>
</head>
<body>
    <div class="header_wrap">
        <div class="header clearfix">
            <div class="fm980 fl clearfix">
                <a href="/index.html" class="logo fl"></a>
                <ul class="nav_box fl">
                    <li><a href="/creative_list.html"  class="cur">形象创意</a></li>
                    <li><a href="/script_list.html">剧本创作</a></li>
                    <li><a href="/render_index.html">动画渲染</a></li>
                    <li><a href="/creative_helper.html">创意助手</a></li>
                </ul>
                <div class="about_box fr">
                    <a href="/about.html">关于我们</a>
                    <#if uid??&&uid!="">
	                    <a href="/user/user_work.html">个人空间</a>
	                    <a href="/logout.html">退出</a>
                    <#else>
	                    <a href="/register.html">注册</a>
	                    <a href="/login.html">登录</a>
                    </#if>
                </div>
            </div>
        </div>
    </div>
    <div class="body_wrap">
        <div class="box_2">
                <div class="box_hd fm980" ></div>
                <div class="box_bd">
                    <div class="fm980">
                        <!-- 上传封面 -->
                        <div class="cover_upload_box clearfix">
            				<span class="fl cover_img cover_img_creative">
                                <img style="width:214px;height:132px;" src="/resources/img/cover_def_214.png" />
                            </span>
                            <div class="cover_upload cover_upload_creative">
                            <p class="mb30"><input type="button" style="cursor:pointer;" class="btn_com_red btn_upload " id="coverButton" value="上传封面" /></p>
                                <div class="tip_box">
                                    <h4>温馨提示： </h4>
                                    <p>1.建议上传尺寸为214*132px，上传格式为JPG/JPEG，大小不超过2M。</p>
                                    <p>2.如果你拥有该作品的“原创著作权”请选择原创分类，并建议在作品上打“水印”。 </p>
                                    <p>3.如果分享他人作品或经验，请一定注明原作者姓名或昵称，尊重其他设计师。</p>
                                </div>
                            </div>

                        </div>
                        <!-- 上传作品 -->
                        <div class="works_upload_box">
                            <ul class="clearfix">
                                <li id="jsMatter" style="display:none;">
                                    <div class="works_img">
                                        <a class="btn_close delImgBtn" href="javascript:;" murl=""></a>
                                        <img style="width:214px;height:132px;" src="/resources/img/eg_works_214.png" />
                                    </div>
                                </li>
                                <li class="works_upload">
                                    <input type="button" style="cursor:pointer;" class="btn_com_red btn_upload " id="matterButton" value="上传素材" />
                                    <p>可上传多个文件<br>文件格式请用JPG/JPEG<br>尺寸需大于640x480</p>
                                </li>
                            </ul>

                        </div>
                    </div>
                    <!-- 作品描述 -->
                    <div class="works_desc_box">
                        <form id="myForm" action="creative_upload.json" method="post">
                            <ul class="fm980">
                                <li class="clearfix">
                                    <label>标题：</label>
                                    <p><input type="text" class="i_text"  name="title" placeholder="20个字符以内" required="true" maxlength="20"/></p>
                                </li>
                                <li class="clearfix">
                                    <label>上传附件：</label>
                                    <p class="file_upload_box">
                                        <input id="source_url" name="source_url" type="text" class="i_text" readonly="readonly"/>
                                        <input type="button" id="source_upload" name="source_upload" class="btn_com_red btn_upload" value="上传附件" />
                                    </p>
                                </li>
                                <li class="clearfix">
                                    <label>作品描述：</label>
                                    <p><textarea class="i_text" name="cdescribe" placeholder="1000个字符以内" required="true" maxlength="1000"></textarea></p>
                                </li>
                            </ul>
                            <div class="works_price_box">
                                <ul class="fm980">
                                    <li class="clearfix">
                                        <label>售价：</label>
                                        <p><input type="text" class="i_text" name="cvalue" placeholder="请输入整数价格" required="true" number="true" min="0"/> 元/人民币</p>
                                    </li>
                                    <!--<li class="clearfix">
                                        <label>角色类型：</label>
                                        <p>
                                            <select ><option></option><option></option></select>
                                        </p>
                                    </li>-->
                                    <li class="clearfix">
                                        <label>授权说明：</label>
                                        <p><textarea class="i_text" name="autro_instr" placeholder="100个字符以内" required="true" maxlength="100"></textarea></p>
                                    </li>
                                    <li class="clearfix">
                                        <p><input id="creative_publish" type="button" class="btn_com_purple" value="发布创意" /></p>
                                    </li>
                                </ul>
                            </div>
                         <div id="data-upload">
                         	<input id="curl" type="hidden" name="curl" >
                         	<input id="surl" type="hidden" name="surl" >
  						 </div> 
                        </form>
                    </div>

                </div>

        </div>

    </div>

    <div class="footer">
        <div class="fm980 clearfix">
            <div class="foot_link foot_link1 fl">
                <a href="/creative_list.html">形象创意</a>
                <a href="/script_list.html">剧本创作</a>
                <a href="/render_index.html">动画渲染</a>
                <a href="/creative_helper.html" >创意助手</a>
            </div>
            <div class="foot_link foot_link2 fl">
                <a href="http://zjusp.zju.edu.cn/">浙大科技园</a>
                <a href="http://www.zju.edu.cn/">浙江大学</a>
                <a href="/about.html" >关于我们</a>
            </div>
            <div class="copy_box fr">
                <img class="mb5" src="/resources/img/foot_text.png" />
                <p>&copy; 2013-2016 All right reserved</p>
                <p><a href="">服务条款</a><a href="">隐私条款</a><a href="">法律条款</a></p>
                <p style="display:none;"><a href="" class="share_icon share_sina"></a><a href="" class="share_icon share_wx"></a></p>
            </div>
        </div>
    </div>
	<script src="/resources/kindeditor/kindeditor.js"></script>
	<script src="/resources/kindeditor/lang/zh_CN.js"></script>
	<script type="text/javascript">

$(function(){	
	var imgCount = 0;
	$(document).on("click",".delImgBtn",function(){
		if(confirm("确定要删除该素材吗？"))
		{
			$(this).parent().parent().remove();
			var murl=$(this).attr("murl");
			$('#'+ murl).remove();
		}
	});
	$("#creative_publish").click(function(){
		$("#myForm").submit();
    });
	
	//验证表单
	$("#myForm").validate({                         
				 messages: { 
					title: { 
					required: "请输入标题", 
					maxlength: "标题不能超过{0}字"
				}, 
				cdescribe: { 
					required: "请输入作品描述",
					maxlength: "描述不能超过{0}字"
			    },
			    cvalue: { 
					required: "请输入售价"
			    },
			    autro_instr: { 
					required: "请输入授权说明",
					maxlength: "说明不能超过{0}字"
			    }
			},
			errorElement: "em",
			errorPlacement: function (error, element) { 
		  		if (element.is(':radio') || element.is(':checkbox')) {
		      		var eid = element.attr('name');
		      		error.appendTo(element.parent());
		  		} else {
		      		error.appendTo(element.closest("p"));
		 		}
			},
			submitHandler:function(form)
			{
				if($("#curl").val()=="")
				{
					alert("请上传封面");
				}
				else if($(".works_img").length <=1 )
				{
					alert("请上传素材");
				}
				else 
				{
					formSubmit($("#myForm"));
				}
			}
	});

		//上传封面
		KindEditor.ready(function(K) {
			var uploadbutton = K.uploadbutton({
				button : K('#coverButton')[0],
				fieldName : 'imgFile',
				url : '/image_upload.json?dir=file',
				afterUpload : function(data) 
				{
					if (data.error === 0) 
					{
						var url = K.formatUrl(data.url, 'absolute');
						$("#curl").val(data.url);
						$(".cover_img img").attr('src',data.url);
					} 
					else 
					{
						alert(data.msg);
					}
				},
				afterError : function(str) {
					alert('自定义错误信息: ' + str);
				}
			});
			uploadbutton.fileBox.change(function(e) {
				uploadbutton.submit();
			});
		});
		//上传素材	
		KindEditor.ready(function(K) {
			var uploadbutton = K.uploadbutton({
				button : K('#matterButton')[0],
				fieldName : 'imgFile',
				url : '/image_upload.json?dir=file',
				afterUpload : function(data) 
				{
					if (data.error === 0) 
					{
						var url = K.formatUrl(data.url, 'absolute');
						imgCount ++;
						var hiddenHtml="<input type=\"hidden\" id=\"murl"+imgCount+"\" name=\"murl\" value=\""+url+"\">";
						$("#data-upload").append(hiddenHtml);
						var newMatter=$("#jsMatter").clone().prependTo(".works_upload_box ul").removeAttr("id").show();
						var img=newMatter.find("img");
						var a=newMatter.find("a");
						img.attr("src",url);
						a.attr("murl","murl"+imgCount);
						$("#murl"+imgCount).val(url);
					} 
					else 
					{
						alert(data.msg);
					}
				},
				afterError : function(str) {
					alert('自定义错误信息: ' + str);
				}
			});
			uploadbutton.fileBox.change(function(e) {
				uploadbutton.submit();
			});
		});
		//上传附件	
		/*KindEditor.ready(function(K) {
			var uploadbutton = K.uploadbutton({
				button : K('#source_upload')[0],
				fieldName : 'imgFile',
				url : '/image_upload.json?dir=file',
				afterUpload : function(data) 
				{
					if (data.error === 0) 
					{
						alert("21");var url = K.formatUrl(data.url, 'absolute');
						$("#surl").val(url);
						$("#source_url").val(url);
						alert(url);
					} 
					else 
					{
						alert(data.msg);
					}
				},
				afterError : function(str) {
					alert('自定义错误信息: ' + str);
				}
			});
			uploadbutton.fileBox.change(function(e) {
				uploadbutton.submit();
			});
		});*/
		var editor = KindEditor.editor({
			allowFileManager : true,
			uploadJson : '/common/upload.json?uploadflag=1'
		});
		
		$('#source_upload').click(function() {
			editor.loadPlugin('insertfile', function() {
				editor.plugin.fileDialog({
					showRemote : false,
					fileUrl : $("#surl").val(),
					clickFn : function(url, title, width, height, border, align) {
						$("#source_url").val(url);
						$("#surl").val(url);
						editor.hideDialog();
					}
				});
			});
		});
});
function formSubmit(form){
    form.ajaxSubmit({
        dataType: "json",              
        success: function(json)             		
        {
        	location.href="creative_detail.html?cid="+json.cid;
        }
    });
};
</script>
<script type="text/javascript" src="/resources/js/page-index.js"></script>
<script type="text/javascript">
	<#if uid??&&uid!="">
    	$.post("/common/getUserName.json",{"uid":${uid}},function(data){
    		if(data.name){
    			$('a[href="/user/user_work.html"]').html(data.name+"个人空间");
    		}
    	});
	 </#if>
</script>
</body>
</html>